﻿@using ServiceStack;
@{
    Layout = "";
}
<style>
    .ngdialog.ngdialog-theme-plain .ngdialog-content {
        width: 40% !important;
    }
</style>
<h3>商城轮播图</h3>

<div class="panel panel-default" ng-controller="CarouselManageController" ng-class="{ 'whirl standard': isLoading}">
    <div class="panel-heading">
        <div class="form-inline ng-pristine ng-valid">
            <div class="form-group" style="width:100%;">
                标题:<input placeholder="标题" class="form-control" type="text" ng-model="Keywords">
                分组:<select style="width: 10%;max-width: 20%;" ng-options="convertToInt(m.Value) as m.Text for m in enumCarouselType" ng-model="TypeId" class="form-control">
                    <option value="">全部</option>
                </select>
                <button type="submit" class="btn btn-labeled btn-primary" ng-click="tableParams.$params.page = 1;tableParams.reload()">
                    <span class="btn-label">
                        <em class="fa fa-search"></em>
                    </span>搜索
                </button>
                <button type="submit" class="btn btn-labeled btn-success" ng-click="editView(0)">
                    <span class="btn-label">
                        <em class="fa fa-plus"></em>
                    </span>新增
                </button>
            </div>
        </div>
    </div>
    <div class="panel-body">
        <div class="table-responsive">
            <table ng-table="tableParams" class="table table-striped table-bproducted table-hover">
                <tbody>
                    <tr ng-repeat="datamodel in $data">
                        <td data-title="'图片'" class="text-center">
                            <img ng-src="{{ImgHostUrl + datamodel.ImgUrl}}" style="max-width: 100px; max-height: 100px" onerror="javascript: this.src = '/Content/img/default.png';" />
                        </td>
                        <td data-title="'标题'" class="text-center">{{datamodel.Tittle}}</td>
                        <td data-title="'类型'" class="text-center">{{convertToEnum(datamodel.TypeId,enumCarouselType)}}</td>
                        <td data-title="'描述'" class="text-center">
                            <div style="-moz-word-break: break-all; -o-word-break: break-all; word-break: break-all; word-wrap: break-word;">
                                {{datamodel.Describe.length>50?datamodel.Describe.substring(0,49)+'...':datamodel.Describe}}
                            </div>
                        </td>
                        <td data-title="'跳转链接'" class="text-center">{{datamodel.LinkUrl}}</td>
                        <td data-title="'排序'" class="text-center" sortable="'Sort'">{{datamodel.Sort}}</td>
                        <td data-title="'添加时间'" class="text-center">{{datamodel.AddTime}}</td>
                        <td data-title="'操作'" nowrap="nowrap" class="text-center">
                            <button type="button" ng-click="editView(datamodel.Id)" class="btn btn-sm btn-edit" title="编辑">
                                <em class="fa fa-edit"></em>
                            </button>
                            <button type="button" ng-click="removeData($index,datamodel)" class="btn btn-sm btn-danger" title="删除">
                                <em class="fa fa-trash-o"></em>
                            </button>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
<script type="text/ng-template" id="deleteConfirmDialog">
    <div class="ngdialog-message text-center">
        <h3>确定要删除吗?</h3>
        <p>删除后不可恢复!</p>
        <button type="button" ng-click="confirm()" class="btn btn-primary mr">确认</button>
        <button type="button" ng-click="closeThisDialog('button')" class="btn btn-default">取消</button>
    </div>
</script>
<script>
    App.controller('CarouselManageController', [
        '$scope', '$resource', '$state', '$route', '$http', 'ngTableParams', 'ngTableDataService', 'Notify', '$filter', 'ngDialog',
        function ($scope, $resource, $state, $route, $http, ngTableParams, ngTableDataService, Notify, $filter, ngDialog) {
            'use strict';
            $scope.isLoading = true;
            $scope.tableParams = new ngTableParams({
                page: 1,
                count: 10,
                sorting: {
                    Id: 'desc' // 初始化排序
                }
            }, {
                getData: function ($defer, params) {
                    $scope.isLoading = true;
                    var requestParams = {
                        Skip: (params.page() - 1) * params.count(),
                        Take: params.count(),
                        Keywords: $scope.Keywords,
                        TypeId:$scope.TypeId
                    };
                    $http.post('/Product/CarouselManage', ngTableDataService.getServerSideParams(params.orderBy().toString(), params, requestParams))
                        .success(function (data, status) {
                            params.total(data.Total);
                            $defer.resolve(data.Results);
                            $scope.isLoading = false;
                        });
                }
            });

            //枚举值获取
            $scope.enumCarouselType = @(Html.Raw(DormMS.Common.EnumUtil.SelectListEnum<DormMS.Model.Enum.CarouselTypeEnum>(null, false).ToJson()));


            //跳转到更新新增页面
            $scope.editView = function (id) {
                $state.go('app.carouselEdit', { "Id": id });
            }


            //删除
            $scope.removeData = function (index, obj) {
                ngDialog.openConfirm({
                    template: 'deleteConfirmDialog',
                    className: 'ngdialog-theme-default'
                }).then(function (value) {
                    $scope.isLoading = true;
                    $http.post("/Product/DelCarousel", { Id: obj.Id }).then(function (returnData) {
                        if (returnData.data.isSuccess) {
                            $scope.tableParams.data.splice(index, 1);
                            Notify.alert('操作成功!', { status: 'success' });
                        } else {
                            Notify.alert(returnData.data.msg, { status: 'warning' });
                        }
                        $scope.isLoading = false;
                    });
                }, function (reason) {
                }
                );
            }



        }
    ]);
</script>
